<template>
<div class="app">
  <h1>我是App组件</h1>
  <h2>哈哈哈哈哈哈哈哈哈</h2>
  <br>
  <button @click="showModal">弹窗</button>
  <Modal v-if="isShowModal" />
</div>
</template>

<script setup lang="ts">
import Modal from './Modal.vue';
import { ref } from 'vue';
const isShowModal = ref(false);
const showModal = () => {
  isShowModal.value = !isShowModal.value;
}
</script>

<style scoped>

.app{
  width: 500px;
  height: 500px;
  background-color: rgb(233, 149, 149);
  box-shadow: 0 0 10px;
  border-radius: 10px;
  padding: 20px;
  filter: saturate(0); /* 饱和度：会影响容器内所有子元素  */
}
</style>


